﻿<!--
// (c) Copyright Microsoft Corporation.
// This source is subject to the Microsoft Public License (Ms-PL).
// Please see http://go.microsoft.com/fwlink/?LinkID=131993 for details.
// All other rights reserved.
-->

<UserControl x:Class="System.Windows.Controls.Samples.DomainUpDownSpinnerSample"
  xmlns:inputToolkit="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Input.Toolkit"
  xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
  xmlns:System="clr-namespace:System;assembly=mscorlib">
  <UserControl.Resources>
    <!-- ButtonSpinnerHorizontalStyle -->
    <Style x:Key="ButtonSpinnerHorizontalStyle" TargetType="inputToolkit:ButtonSpinner">
      <Setter Property="HorizontalContentAlignment" Value="Center"/>
      <Setter Property="VerticalContentAlignment" Value="Center"/>
      <Setter Property="Template">
        <Setter.Value>
          <ControlTemplate TargetType="inputToolkit:ButtonSpinner">
            <Grid>
              <Grid.Resources>
                <ControlTemplate x:Key="IncreaseButtonTemplate" TargetType="RepeatButton">
                  <Grid x:Name="Root">
                    <vsm:VisualStateManager.VisualStateGroups>
                      <vsm:VisualStateGroup x:Name="CommonStates">
                        <vsm:VisualStateGroup.Transitions>
                          <vsm:VisualTransition GeneratedDuration="0"/>
                          <vsm:VisualTransition GeneratedDuration="00:00:00.1" To="MouseOver"/>
                          <vsm:VisualTransition GeneratedDuration="00:00:00.1" To="Pressed"/>
                        </vsm:VisualStateGroup.Transitions>
                        <vsm:VisualState x:Name="Normal"/>
                        <vsm:VisualState x:Name="MouseOver">
                          <Storyboard>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#FF448DCA"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#F2FFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#CCFFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#7FFFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                          </Storyboard>
                        </vsm:VisualState>
                        <vsm:VisualState x:Name="Pressed">
                          <Storyboard>
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="Highlight" Storyboard.TargetProperty="(UIElement.Opacity)">
                              <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                            </DoubleAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#FF448DCA"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#F4FFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#EAFFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#C6FFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#6BFFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                          </Storyboard>
                        </vsm:VisualState>
                        <vsm:VisualState x:Name="Disabled">
                          <Storyboard>
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="Opacity">
                              <SplineDoubleKeyFrame KeyTime="0" Value="1"/>
                            </DoubleAnimationUsingKeyFrames>
                          </Storyboard>
                        </vsm:VisualState>
                      </vsm:VisualStateGroup>
                      <vsm:VisualStateGroup x:Name="FocusStates">
                        <vsm:VisualState x:Name="Focused">
                          <Storyboard>
                            <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="Visibility">
                              <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
                            </ObjectAnimationUsingKeyFrames>
                          </Storyboard>
                        </vsm:VisualState>
                        <vsm:VisualState x:Name="Unfocused"/>
                      </vsm:VisualStateGroup>
                    </vsm:VisualStateManager.VisualStateGroups>
                    <Rectangle x:Name="Background" Fill="{TemplateBinding Background}" StrokeThickness="1" RadiusX="2" RadiusY="2">
                      <Rectangle.Stroke>
                        <LinearGradientBrush EndPoint=".5,1" StartPoint=".5,0">
                          <GradientStop Color="#FFAEB7BF" Offset="0"/>
                          <GradientStop Color="#FF919EA7" Offset="0.35"/>
                          <GradientStop Color="#FF7A8A99" Offset="0.35"/>
                          <GradientStop Color="#FF647480" Offset="1"/>
                        </LinearGradientBrush>
                      </Rectangle.Stroke>
                    </Rectangle>
                    <Rectangle Margin="1" x:Name="BackgroundGradient" Stroke="#FFFFFFFF" StrokeThickness="1" RadiusX="1" RadiusY="1">
                      <Rectangle.Fill>
                        <LinearGradientBrush EndPoint=".7,1" StartPoint=".7,0">
                          <GradientStop Color="#FFFFFFFF" Offset="0"/>
                          <GradientStop Color="#F9FFFFFF" Offset="0.375"/>
                          <GradientStop Color="#E5FFFFFF" Offset="0.625"/>
                          <GradientStop Color="#C6FFFFFF" Offset="1"/>
                        </LinearGradientBrush>
                      </Rectangle.Fill>
                    </Rectangle>
                    <Rectangle Margin="1" x:Name="Highlight" IsHitTestVisible="false" Opacity="0" Stroke="#FF45D6FA" StrokeThickness="1" RadiusX="1" RadiusY="1"/>
                    <Border x:Name="DisabledVisualElement" IsHitTestVisible="False" Opacity="0" Background="#A5F7F7F7" BorderBrush="#A5F7F7F7" BorderThickness="{TemplateBinding BorderThickness}"/>
                    <Rectangle x:Name="FocusVisualElement" IsHitTestVisible="false" Visibility="Collapsed" Stroke="#FF45D6FA" StrokeThickness="1" RadiusX="1" RadiusY="1"/>
                    <Path HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Fill="#FF333333" Stretch="Uniform" Data="F1 M 541.537,173.589L 531.107,173.589L 536.322,167.49L 541.537,173.589 Z " Margin="4,3,4,3"/>
                  </Grid>
                </ControlTemplate>
                <ControlTemplate x:Key="DecreaseButtonTemplate" TargetType="RepeatButton">
                  <Grid x:Name="Root">
                    <vsm:VisualStateManager.VisualStateGroups>
                      <vsm:VisualStateGroup x:Name="CommonStates">
                        <vsm:VisualStateGroup.Transitions>
                          <vsm:VisualTransition GeneratedDuration="0"/>
                          <vsm:VisualTransition GeneratedDuration="00:00:00.1" To="MouseOver"/>
                          <vsm:VisualTransition GeneratedDuration="00:00:00.1" To="Pressed"/>
                        </vsm:VisualStateGroup.Transitions>
                        <vsm:VisualState x:Name="Normal"/>
                        <vsm:VisualState x:Name="MouseOver">
                          <Storyboard>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#FF448DCA"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#F2FFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#CCFFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#7FFFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                          </Storyboard>
                        </vsm:VisualState>
                        <vsm:VisualState x:Name="Pressed">
                          <Storyboard>
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="Highlight" Storyboard.TargetProperty="(UIElement.Opacity)">
                              <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                            </DoubleAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#FF448DCA"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#F4FFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#EAFFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#C6FFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#6BFFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                          </Storyboard>
                        </vsm:VisualState>
                        <vsm:VisualState x:Name="Disabled">
                          <Storyboard>
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="Opacity">
                              <SplineDoubleKeyFrame KeyTime="0" Value="1"/>
                            </DoubleAnimationUsingKeyFrames>
                          </Storyboard>
                        </vsm:VisualState>
                      </vsm:VisualStateGroup>
                      <vsm:VisualStateGroup x:Name="FocusStates">
                        <vsm:VisualState x:Name="Focused">
                          <Storyboard>
                            <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="Visibility">
                              <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
                            </ObjectAnimationUsingKeyFrames>
                          </Storyboard>
                        </vsm:VisualState>
                        <vsm:VisualState x:Name="Unfocused"/>
                      </vsm:VisualStateGroup>
                    </vsm:VisualStateManager.VisualStateGroups>
                    <Rectangle x:Name="Background" Fill="{TemplateBinding Background}" StrokeThickness="1" RadiusX="2" RadiusY="2">
                      <Rectangle.Stroke>
                        <LinearGradientBrush EndPoint=".5,1" StartPoint=".5,0">
                          <GradientStop Color="#FFAEB7BF" Offset="0"/>
                          <GradientStop Color="#FF919EA7" Offset="0.35"/>
                          <GradientStop Color="#FF7A8A99" Offset="0.35"/>
                          <GradientStop Color="#FF647480" Offset="1"/>
                        </LinearGradientBrush>
                      </Rectangle.Stroke>
                    </Rectangle>
                    <Rectangle Margin="1" x:Name="BackgroundGradient" Stroke="#FFFFFFFF" StrokeThickness="1" RadiusX="1" RadiusY="1">
                      <Rectangle.Fill>
                        <LinearGradientBrush EndPoint=".7,1" StartPoint=".7,0">
                          <GradientStop Color="#FFFFFFFF" Offset="0"/>
                          <GradientStop Color="#F9FFFFFF" Offset="0.375"/>
                          <GradientStop Color="#E5FFFFFF" Offset="0.625"/>
                          <GradientStop Color="#C6FFFFFF" Offset="1"/>
                        </LinearGradientBrush>
                      </Rectangle.Fill>
                    </Rectangle>
                    <Rectangle Margin="1" x:Name="Highlight" IsHitTestVisible="false" Opacity="0" Stroke="#FF45D6FA" StrokeThickness="1" RadiusX="1" RadiusY="1"/>
                    <Border x:Name="DisabledVisualElement" IsHitTestVisible="False" Opacity="0" Background="#A5F7F7F7" BorderBrush="#A5F7F7F7" BorderThickness="{TemplateBinding BorderThickness}"/>
                    <Rectangle x:Name="FocusVisualElement" IsHitTestVisible="false" Visibility="Collapsed" Stroke="#FF45D6FA" StrokeThickness="1" RadiusX="1" RadiusY="1"/>
                    <Path Height="Auto" HorizontalAlignment="Stretch" Margin="4,3,4,3" VerticalAlignment="Stretch" Width="Auto" Fill="#FF333333" Stretch="Uniform" Data="F1 M 531.107,321.943L 541.537,321.943L 536.322,328.042L 531.107,321.943 Z "/>
                  </Grid>
                </ControlTemplate>
              </Grid.Resources>
              <vsm:VisualStateManager.VisualStateGroups>
                <!-- common states -->
                <vsm:VisualStateGroup x:Name="CommonStates">
                  <vsm:VisualStateGroup.Transitions>
                    <vsm:VisualTransition GeneratedDuration="0"/>
                  </vsm:VisualStateGroup.Transitions>
                  <vsm:VisualState x:Name="Normal"/>
                  <vsm:VisualState x:Name="Disabled">
                    <Storyboard>
                      <DoubleAnimation Duration="0" Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="(UIElement.Opacity)" To="1"/>
                    </Storyboard>
                  </vsm:VisualState>
                </vsm:VisualStateGroup>
                <!-- focus states -->
                <vsm:VisualStateGroup x:Name="FocusStates">
                  <vsm:VisualState x:Name="Focused">
                    <Storyboard>
                      <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="Visibility">
                        <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
                      </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                  </vsm:VisualState>
                  <vsm:VisualState x:Name="Unfocused"/>
                </vsm:VisualStateGroup>
                <!-- Increase states -->
                <vsm:VisualStateGroup x:Name="IncreaseStates">
                  <vsm:VisualState x:Name="IncreaseEnabled" />
                  <vsm:VisualState x:Name="IncreaseDisabled" />
                </vsm:VisualStateGroup>
                <!-- Decrease states-->
                <vsm:VisualStateGroup x:Name="DecreaseStates">
                  <vsm:VisualState x:Name="DecreaseEnabled" />
                  <vsm:VisualState x:Name="DecreaseDisabled" />
                </vsm:VisualStateGroup>
              </vsm:VisualStateManager.VisualStateGroups>
              <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}">
                <Grid>
                  <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="*"/>
                    <RowDefinition Height="Auto"/>
                  </Grid.RowDefinitions>
                  <ContentPresenter Grid.Row="1" 
                                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
                                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
                                    Content="{TemplateBinding Content}"/>
                  <Button Grid.Row="0" IsTabStop="False" IsHitTestVisible="True">
                    <Button.Template>
                      <ControlTemplate TargetType="Button">
                        <Grid Background="Transparent" />
                      </ControlTemplate>
                    </Button.Template>
                  </Button>
                  <Button Grid.Row="2" IsTabStop="False" IsHitTestVisible="True">
                    <Button.Template>
                      <ControlTemplate TargetType="Button">
                        <Grid Background="Transparent" />
                      </ControlTemplate>
                    </Button.Template>
                  </Button>
                  <RepeatButton Grid.Row="0" Height="24" IsTabStop="False" Template="{StaticResource IncreaseButtonTemplate}" x:Name="IncreaseButton" ClickMode="Press"/>
                  <RepeatButton Grid.Row="2" Height="24" IsTabStop="False" Template="{StaticResource DecreaseButtonTemplate}" x:Name="DecreaseButton" ClickMode="Press"/>
                </Grid>
              </Border>
              <Border x:Name="DisabledVisualElement" IsHitTestVisible="false" Opacity="0" Background="#A5FFFFFF" CornerRadius="3"/>
              <Border x:Name="FocusVisualElement" IsHitTestVisible="false" Visibility="Collapsed" BorderBrush="#FF45D6FA" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="1,1,1,1"/>
            </Grid>
          </ControlTemplate>
        </Setter.Value>
      </Setter>
    </Style>
    
    <!-- ButtonSpinnerLeftyStyle -->
    <Style x:Key="ButtonSpinnerLeftyStyle" TargetType="inputToolkit:ButtonSpinner">
      <Setter Property="HorizontalContentAlignment" Value="Center"/>
      <Setter Property="VerticalContentAlignment" Value="Center"/>
      <Setter Property="Template">
        <Setter.Value>
          <ControlTemplate TargetType="inputToolkit:ButtonSpinner">
            <Grid>
              <Grid.Resources>
                <ControlTemplate x:Key="IncreaseButtonTemplate" TargetType="RepeatButton">
                  <Grid x:Name="Root">
                    <vsm:VisualStateManager.VisualStateGroups>
                      <vsm:VisualStateGroup x:Name="CommonStates">
                        <vsm:VisualStateGroup.Transitions>
                          <vsm:VisualTransition GeneratedDuration="0"/>
                          <vsm:VisualTransition GeneratedDuration="00:00:00.1" To="MouseOver"/>
                          <vsm:VisualTransition GeneratedDuration="00:00:00.1" To="Pressed"/>
                        </vsm:VisualStateGroup.Transitions>
                        <vsm:VisualState x:Name="Normal"/>
                        <vsm:VisualState x:Name="MouseOver">
                          <Storyboard>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#FF448DCA"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#F2FFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#CCFFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#7FFFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                          </Storyboard>
                        </vsm:VisualState>
                        <vsm:VisualState x:Name="Pressed">
                          <Storyboard>
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="Highlight" Storyboard.TargetProperty="(UIElement.Opacity)">
                              <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                            </DoubleAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#FF448DCA"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#F4FFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#EAFFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#C6FFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#6BFFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                          </Storyboard>
                        </vsm:VisualState>
                        <vsm:VisualState x:Name="Disabled">
                          <Storyboard>
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="Opacity">
                              <SplineDoubleKeyFrame KeyTime="0" Value="1"/>
                            </DoubleAnimationUsingKeyFrames>
                          </Storyboard>
                        </vsm:VisualState>
                      </vsm:VisualStateGroup>
                      <vsm:VisualStateGroup x:Name="FocusStates">
                        <vsm:VisualState x:Name="Focused">
                          <Storyboard>
                            <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="Visibility">
                              <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
                            </ObjectAnimationUsingKeyFrames>
                          </Storyboard>
                        </vsm:VisualState>
                        <vsm:VisualState x:Name="Unfocused"/>
                      </vsm:VisualStateGroup>
                    </vsm:VisualStateManager.VisualStateGroups>
                    <Rectangle x:Name="Background" Fill="{TemplateBinding Background}" StrokeThickness="1" RadiusX="2" RadiusY="2">
                      <Rectangle.Stroke>
                        <LinearGradientBrush EndPoint=".5,1" StartPoint=".5,0">
                          <GradientStop Color="#FFAEB7BF" Offset="0"/>
                          <GradientStop Color="#FF919EA7" Offset="0.35"/>
                          <GradientStop Color="#FF7A8A99" Offset="0.35"/>
                          <GradientStop Color="#FF647480" Offset="1"/>
                        </LinearGradientBrush>
                      </Rectangle.Stroke>
                    </Rectangle>
                    <Rectangle Margin="1" x:Name="BackgroundGradient" Stroke="#FFFFFFFF" StrokeThickness="1" RadiusX="1" RadiusY="1">
                      <Rectangle.Fill>
                        <LinearGradientBrush EndPoint=".7,1" StartPoint=".7,0">
                          <GradientStop Color="#FFFFFFFF" Offset="0"/>
                          <GradientStop Color="#F9FFFFFF" Offset="0.375"/>
                          <GradientStop Color="#E5FFFFFF" Offset="0.625"/>
                          <GradientStop Color="#C6FFFFFF" Offset="1"/>
                        </LinearGradientBrush>
                      </Rectangle.Fill>
                    </Rectangle>
                    <Rectangle Margin="1" x:Name="Highlight" IsHitTestVisible="false" Opacity="0" Stroke="#FF45D6FA" StrokeThickness="1" RadiusX="1" RadiusY="1"/>
                    <Border x:Name="DisabledVisualElement" IsHitTestVisible="False" Opacity="0" Background="#A5F7F7F7" BorderBrush="#A5F7F7F7" BorderThickness="{TemplateBinding BorderThickness}"/>
                    <Rectangle x:Name="FocusVisualElement" IsHitTestVisible="false" Visibility="Collapsed" Stroke="#FF45D6FA" StrokeThickness="1" RadiusX="1" RadiusY="1"/>
                    <Path HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Fill="#FF333333" Stretch="Uniform" Data="F1 M 541.537,173.589L 531.107,173.589L 536.322,167.49L 541.537,173.589 Z " Margin="4,3,4,3"/>
                  </Grid>
                </ControlTemplate>
                <ControlTemplate x:Key="DecreaseButtonTemplate" TargetType="RepeatButton">
                  <Grid x:Name="Root">
                    <vsm:VisualStateManager.VisualStateGroups>
                      <vsm:VisualStateGroup x:Name="CommonStates">
                        <vsm:VisualStateGroup.Transitions>
                          <vsm:VisualTransition GeneratedDuration="0"/>
                          <vsm:VisualTransition GeneratedDuration="00:00:00.1" To="MouseOver"/>
                          <vsm:VisualTransition GeneratedDuration="00:00:00.1" To="Pressed"/>
                        </vsm:VisualStateGroup.Transitions>
                        <vsm:VisualState x:Name="Normal"/>
                        <vsm:VisualState x:Name="MouseOver">
                          <Storyboard>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#FF448DCA"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#F2FFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#CCFFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#7FFFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                          </Storyboard>
                        </vsm:VisualState>
                        <vsm:VisualState x:Name="Pressed">
                          <Storyboard>
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="Highlight" Storyboard.TargetProperty="(UIElement.Opacity)">
                              <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                            </DoubleAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#FF448DCA"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#F4FFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#EAFFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#C6FFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)">
                              <SplineColorKeyFrame KeyTime="00:00:00" Value="#6BFFFFFF"/>
                            </ColorAnimationUsingKeyFrames>
                          </Storyboard>
                        </vsm:VisualState>
                        <vsm:VisualState x:Name="Disabled">
                          <Storyboard>
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="Opacity">
                              <SplineDoubleKeyFrame KeyTime="0" Value="1"/>
                            </DoubleAnimationUsingKeyFrames>
                          </Storyboard>
                        </vsm:VisualState>
                      </vsm:VisualStateGroup>
                      <vsm:VisualStateGroup x:Name="FocusStates">
                        <vsm:VisualState x:Name="Focused">
                          <Storyboard>
                            <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="Visibility">
                              <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
                            </ObjectAnimationUsingKeyFrames>
                          </Storyboard>
                        </vsm:VisualState>
                        <vsm:VisualState x:Name="Unfocused"/>
                      </vsm:VisualStateGroup>
                    </vsm:VisualStateManager.VisualStateGroups>
                    <Rectangle x:Name="Background" Fill="{TemplateBinding Background}" StrokeThickness="1" RadiusX="2" RadiusY="2">
                      <Rectangle.Stroke>
                        <LinearGradientBrush EndPoint=".5,1" StartPoint=".5,0">
                          <GradientStop Color="#FFAEB7BF" Offset="0"/>
                          <GradientStop Color="#FF919EA7" Offset="0.35"/>
                          <GradientStop Color="#FF7A8A99" Offset="0.35"/>
                          <GradientStop Color="#FF647480" Offset="1"/>
                        </LinearGradientBrush>
                      </Rectangle.Stroke>
                    </Rectangle>
                    <Rectangle Margin="1" x:Name="BackgroundGradient" Stroke="#FFFFFFFF" StrokeThickness="1" RadiusX="1" RadiusY="1">
                      <Rectangle.Fill>
                        <LinearGradientBrush EndPoint=".7,1" StartPoint=".7,0">
                          <GradientStop Color="#FFFFFFFF" Offset="0"/>
                          <GradientStop Color="#F9FFFFFF" Offset="0.375"/>
                          <GradientStop Color="#E5FFFFFF" Offset="0.625"/>
                          <GradientStop Color="#C6FFFFFF" Offset="1"/>
                        </LinearGradientBrush>
                      </Rectangle.Fill>
                    </Rectangle>
                    <Rectangle Margin="1" x:Name="Highlight" IsHitTestVisible="false" Opacity="0" Stroke="#FF45D6FA" StrokeThickness="1" RadiusX="1" RadiusY="1"/>
                    <Border x:Name="DisabledVisualElement" IsHitTestVisible="False" Opacity="0" Background="#A5F7F7F7" BorderBrush="#A5F7F7F7" BorderThickness="{TemplateBinding BorderThickness}"/>
                    <Rectangle x:Name="FocusVisualElement" IsHitTestVisible="false" Visibility="Collapsed" Stroke="#FF45D6FA" StrokeThickness="1" RadiusX="1" RadiusY="1"/>
                    <Path Height="Auto" HorizontalAlignment="Stretch" Margin="4,3,4,3" VerticalAlignment="Stretch" Width="Auto" Fill="#FF333333" Stretch="Uniform" Data="F1 M 531.107,321.943L 541.537,321.943L 536.322,328.042L 531.107,321.943 Z "/>
                  </Grid>
                </ControlTemplate>
              </Grid.Resources>
              <vsm:VisualStateManager.VisualStateGroups>
                <!-- common states -->
                <vsm:VisualStateGroup x:Name="CommonStates">
                  <vsm:VisualStateGroup.Transitions>
                    <vsm:VisualTransition GeneratedDuration="0"/>
                  </vsm:VisualStateGroup.Transitions>
                  <vsm:VisualState x:Name="Normal"/>
                  <vsm:VisualState x:Name="Disabled">
                    <Storyboard>
                      <DoubleAnimation Duration="0" Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="(UIElement.Opacity)" To="1"/>
                    </Storyboard>
                  </vsm:VisualState>
                </vsm:VisualStateGroup>
                <!-- focus states -->
                <vsm:VisualStateGroup x:Name="FocusStates">
                  <vsm:VisualState x:Name="Focused">
                    <Storyboard>
                      <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="Visibility">
                        <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
                      </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                  </vsm:VisualState>
                  <vsm:VisualState x:Name="Unfocused"/>
                </vsm:VisualStateGroup>
                <!-- Increase states -->
                <vsm:VisualStateGroup x:Name="IncreaseStates">
                  <vsm:VisualState x:Name="IncreaseEnabled" />
                  <vsm:VisualState x:Name="IncreaseDisabled" />
                </vsm:VisualStateGroup>
                <!-- Decrease states-->
                <vsm:VisualStateGroup x:Name="DecreaseStates">
                  <vsm:VisualState x:Name="DecreaseEnabled" />
                  <vsm:VisualState x:Name="DecreaseDisabled" />
                </vsm:VisualStateGroup>
              </vsm:VisualStateManager.VisualStateGroups>
              <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}">
                <Grid>
                  <Grid.RowDefinitions>
                    <RowDefinition />
                    <RowDefinition />
                  </Grid.RowDefinitions>
                  <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="*"/>
                  </Grid.ColumnDefinitions>
                  <ContentPresenter Grid.Column="1" Grid.RowSpan="2"
                                    HorizontalAlignment="Stretch" 
                                    VerticalAlignment="Stretch"
                                    Content="{TemplateBinding Content}"/>
                  <Button Grid.Column="0" Grid.RowSpan="2" IsTabStop="False" IsHitTestVisible="True">
                    <Button.Template>
                      <ControlTemplate TargetType="Button">
                        <Grid Background="Transparent" />
                      </ControlTemplate>
                    </Button.Template>
                  </Button>
                  <RepeatButton Grid.Row="0" Height="24" Width="20" IsTabStop="False" Template="{StaticResource IncreaseButtonTemplate}" x:Name="IncreaseButton" ClickMode="Press"/>
                  <RepeatButton Grid.Row="1" Height="24" Width="20" IsTabStop="False" Template="{StaticResource DecreaseButtonTemplate}" x:Name="DecreaseButton" ClickMode="Press"/>
                </Grid>
              </Border>
              <Border x:Name="DisabledVisualElement" IsHitTestVisible="false" Opacity="0" Background="#A5FFFFFF" CornerRadius="3"/>
              <Border x:Name="FocusVisualElement" IsHitTestVisible="false" Visibility="Collapsed" BorderBrush="#FF45D6FA" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="1,1,1,1"/>
            </Grid>
          </ControlTemplate>
        </Setter.Value>
      </Setter>
    </Style>

  </UserControl.Resources>

  <StackPanel Background="White">
    <ContentControl
      Content="Button spinner Horizontal"
      Style="{StaticResource Header}" />
    <inputToolkit:DomainUpDown
      MinWidth="120"
      Height="80"
      HorizontalAlignment="Left"
      SpinnerStyle="{StaticResource ButtonSpinnerHorizontalStyle}">
      <System:String>Red</System:String>
      <System:String>Green</System:String>
      <System:String>Blue</System:String>
      <System:String>Yellow</System:String>
      <System:String>Black</System:String>
    </inputToolkit:DomainUpDown>

    <ContentControl
      Content="Button spinner Left"
      Style="{StaticResource Header}" />
    <inputToolkit:DomainUpDown
      MinWidth="120"
      Height="60"
      HorizontalAlignment="Left"
      SpinnerStyle="{StaticResource ButtonSpinnerLeftyStyle}">
      <System:String>Red</System:String>
      <System:String>Green</System:String>
      <System:String>Blue</System:String>
      <System:String>Yellow</System:String>
      <System:String>Black</System:String>
    </inputToolkit:DomainUpDown>
    <src:SourceViewer xmlns:src="clr-namespace:System.Windows.Controls.Samples;assembly=System.Windows.Controls.Samples.Common" xmlns:sys="clr-namespace:System;assembly=mscorlib">
  <src:SourceFile Path="DomainUpDownSpinnerSample.xaml">
    <src:SourceFile.Source>
      <sys:String>&lt;!--
// (c) Copyright Microsoft Corporation.
// This source is subject to the Microsoft Public License (Ms-PL).
// Please see http://go.microsoft.com/fwlink/?LinkID=131993 for details.
// All other rights reserved.
--&gt;

&lt;UserControl x:Class="System.Windows.Controls.Samples.DomainUpDownSpinnerSample"
  xmlns:inputToolkit="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Input.Toolkit"
  xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
  xmlns:System="clr-namespace:System;assembly=mscorlib"&gt;
  &lt;UserControl.Resources&gt;
    &lt;!-- ButtonSpinnerHorizontalStyle --&gt;
    &lt;Style x:Key="ButtonSpinnerHorizontalStyle" TargetType="inputToolkit:ButtonSpinner"&gt;
      &lt;Setter Property="HorizontalContentAlignment" Value="Center"/&gt;
      &lt;Setter Property="VerticalContentAlignment" Value="Center"/&gt;
      &lt;Setter Property="Template"&gt;
        &lt;Setter.Value&gt;
          &lt;ControlTemplate TargetType="inputToolkit:ButtonSpinner"&gt;
            &lt;Grid&gt;
              &lt;Grid.Resources&gt;
                &lt;ControlTemplate x:Key="IncreaseButtonTemplate" TargetType="RepeatButton"&gt;
                  &lt;Grid x:Name="Root"&gt;
                    &lt;vsm:VisualStateManager.VisualStateGroups&gt;
                      &lt;vsm:VisualStateGroup x:Name="CommonStates"&gt;
                        &lt;vsm:VisualStateGroup.Transitions&gt;
                          &lt;vsm:VisualTransition GeneratedDuration="0"/&gt;
                          &lt;vsm:VisualTransition GeneratedDuration="00:00:00.1" To="MouseOver"/&gt;
                          &lt;vsm:VisualTransition GeneratedDuration="00:00:00.1" To="Pressed"/&gt;
                        &lt;/vsm:VisualStateGroup.Transitions&gt;
                        &lt;vsm:VisualState x:Name="Normal"/&gt;
                        &lt;vsm:VisualState x:Name="MouseOver"&gt;
                          &lt;Storyboard&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#FF448DCA"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#F2FFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#CCFFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#7FFFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                          &lt;/Storyboard&gt;
                        &lt;/vsm:VisualState&gt;
                        &lt;vsm:VisualState x:Name="Pressed"&gt;
                          &lt;Storyboard&gt;
                            &lt;DoubleAnimationUsingKeyFrames Storyboard.TargetName="Highlight" Storyboard.TargetProperty="(UIElement.Opacity)"&gt;
                              &lt;SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/&gt;
                            &lt;/DoubleAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#FF448DCA"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#F4FFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#EAFFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#C6FFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#6BFFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                          &lt;/Storyboard&gt;
                        &lt;/vsm:VisualState&gt;
                        &lt;vsm:VisualState x:Name="Disabled"&gt;
                          &lt;Storyboard&gt;
                            &lt;DoubleAnimationUsingKeyFrames Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="Opacity"&gt;
                              &lt;SplineDoubleKeyFrame KeyTime="0" Value="1"/&gt;
                            &lt;/DoubleAnimationUsingKeyFrames&gt;
                          &lt;/Storyboard&gt;
                        &lt;/vsm:VisualState&gt;
                      &lt;/vsm:VisualStateGroup&gt;
                      &lt;vsm:VisualStateGroup x:Name="FocusStates"&gt;
                        &lt;vsm:VisualState x:Name="Focused"&gt;
                          &lt;Storyboard&gt;
                            &lt;ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="Visibility"&gt;
                              &lt;DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/&gt;
                            &lt;/ObjectAnimationUsingKeyFrames&gt;
                          &lt;/Storyboard&gt;
                        &lt;/vsm:VisualState&gt;
                        &lt;vsm:VisualState x:Name="Unfocused"/&gt;
                      &lt;/vsm:VisualStateGroup&gt;
                    &lt;/vsm:VisualStateManager.VisualStateGroups&gt;
                    &lt;Rectangle x:Name="Background" Fill="{TemplateBinding Background}" StrokeThickness="1" RadiusX="2" RadiusY="2"&gt;
                      &lt;Rectangle.Stroke&gt;
                        &lt;LinearGradientBrush EndPoint=".5,1" StartPoint=".5,0"&gt;
                          &lt;GradientStop Color="#FFAEB7BF" Offset="0"/&gt;
                          &lt;GradientStop Color="#FF919EA7" Offset="0.35"/&gt;
                          &lt;GradientStop Color="#FF7A8A99" Offset="0.35"/&gt;
                          &lt;GradientStop Color="#FF647480" Offset="1"/&gt;
                        &lt;/LinearGradientBrush&gt;
                      &lt;/Rectangle.Stroke&gt;
                    &lt;/Rectangle&gt;
                    &lt;Rectangle Margin="1" x:Name="BackgroundGradient" Stroke="#FFFFFFFF" StrokeThickness="1" RadiusX="1" RadiusY="1"&gt;
                      &lt;Rectangle.Fill&gt;
                        &lt;LinearGradientBrush EndPoint=".7,1" StartPoint=".7,0"&gt;
                          &lt;GradientStop Color="#FFFFFFFF" Offset="0"/&gt;
                          &lt;GradientStop Color="#F9FFFFFF" Offset="0.375"/&gt;
                          &lt;GradientStop Color="#E5FFFFFF" Offset="0.625"/&gt;
                          &lt;GradientStop Color="#C6FFFFFF" Offset="1"/&gt;
                        &lt;/LinearGradientBrush&gt;
                      &lt;/Rectangle.Fill&gt;
                    &lt;/Rectangle&gt;
                    &lt;Rectangle Margin="1" x:Name="Highlight" IsHitTestVisible="false" Opacity="0" Stroke="#FF45D6FA" StrokeThickness="1" RadiusX="1" RadiusY="1"/&gt;
                    &lt;Border x:Name="DisabledVisualElement" IsHitTestVisible="False" Opacity="0" Background="#A5F7F7F7" BorderBrush="#A5F7F7F7" BorderThickness="{TemplateBinding BorderThickness}"/&gt;
                    &lt;Rectangle x:Name="FocusVisualElement" IsHitTestVisible="false" Visibility="Collapsed" Stroke="#FF45D6FA" StrokeThickness="1" RadiusX="1" RadiusY="1"/&gt;
                    &lt;Path HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Fill="#FF333333" Stretch="Uniform" Data="F1 M 541.537,173.589L 531.107,173.589L 536.322,167.49L 541.537,173.589 Z " Margin="4,3,4,3"/&gt;
                  &lt;/Grid&gt;
                &lt;/ControlTemplate&gt;
                &lt;ControlTemplate x:Key="DecreaseButtonTemplate" TargetType="RepeatButton"&gt;
                  &lt;Grid x:Name="Root"&gt;
                    &lt;vsm:VisualStateManager.VisualStateGroups&gt;
                      &lt;vsm:VisualStateGroup x:Name="CommonStates"&gt;
                        &lt;vsm:VisualStateGroup.Transitions&gt;
                          &lt;vsm:VisualTransition GeneratedDuration="0"/&gt;
                          &lt;vsm:VisualTransition GeneratedDuration="00:00:00.1" To="MouseOver"/&gt;
                          &lt;vsm:VisualTransition GeneratedDuration="00:00:00.1" To="Pressed"/&gt;
                        &lt;/vsm:VisualStateGroup.Transitions&gt;
                        &lt;vsm:VisualState x:Name="Normal"/&gt;
                        &lt;vsm:VisualState x:Name="MouseOver"&gt;
                          &lt;Storyboard&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#FF448DCA"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#F2FFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#CCFFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#7FFFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                          &lt;/Storyboard&gt;
                        &lt;/vsm:VisualState&gt;
                        &lt;vsm:VisualState x:Name="Pressed"&gt;
                          &lt;Storyboard&gt;
                            &lt;DoubleAnimationUsingKeyFrames Storyboard.TargetName="Highlight" Storyboard.TargetProperty="(UIElement.Opacity)"&gt;
                              &lt;SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/&gt;
                            &lt;/DoubleAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#FF448DCA"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#F4FFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#EAFFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#C6FFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#6BFFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                          &lt;/Storyboard&gt;
                        &lt;/vsm:VisualState&gt;
                        &lt;vsm:VisualState x:Name="Disabled"&gt;
                          &lt;Storyboard&gt;
                            &lt;DoubleAnimationUsingKeyFrames Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="Opacity"&gt;
                              &lt;SplineDoubleKeyFrame KeyTime="0" Value="1"/&gt;
                            &lt;/DoubleAnimationUsingKeyFrames&gt;
                          &lt;/Storyboard&gt;
                        &lt;/vsm:VisualState&gt;
                      &lt;/vsm:VisualStateGroup&gt;
                      &lt;vsm:VisualStateGroup x:Name="FocusStates"&gt;
                        &lt;vsm:VisualState x:Name="Focused"&gt;
                          &lt;Storyboard&gt;
                            &lt;ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="Visibility"&gt;
                              &lt;DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/&gt;
                            &lt;/ObjectAnimationUsingKeyFrames&gt;
                          &lt;/Storyboard&gt;
                        &lt;/vsm:VisualState&gt;
                        &lt;vsm:VisualState x:Name="Unfocused"/&gt;
                      &lt;/vsm:VisualStateGroup&gt;
                    &lt;/vsm:VisualStateManager.VisualStateGroups&gt;
                    &lt;Rectangle x:Name="Background" Fill="{TemplateBinding Background}" StrokeThickness="1" RadiusX="2" RadiusY="2"&gt;
                      &lt;Rectangle.Stroke&gt;
                        &lt;LinearGradientBrush EndPoint=".5,1" StartPoint=".5,0"&gt;
                          &lt;GradientStop Color="#FFAEB7BF" Offset="0"/&gt;
                          &lt;GradientStop Color="#FF919EA7" Offset="0.35"/&gt;
                          &lt;GradientStop Color="#FF7A8A99" Offset="0.35"/&gt;
                          &lt;GradientStop Color="#FF647480" Offset="1"/&gt;
                        &lt;/LinearGradientBrush&gt;
                      &lt;/Rectangle.Stroke&gt;
                    &lt;/Rectangle&gt;
                    &lt;Rectangle Margin="1" x:Name="BackgroundGradient" Stroke="#FFFFFFFF" StrokeThickness="1" RadiusX="1" RadiusY="1"&gt;
                      &lt;Rectangle.Fill&gt;
                        &lt;LinearGradientBrush EndPoint=".7,1" StartPoint=".7,0"&gt;
                          &lt;GradientStop Color="#FFFFFFFF" Offset="0"/&gt;
                          &lt;GradientStop Color="#F9FFFFFF" Offset="0.375"/&gt;
                          &lt;GradientStop Color="#E5FFFFFF" Offset="0.625"/&gt;
                          &lt;GradientStop Color="#C6FFFFFF" Offset="1"/&gt;
                        &lt;/LinearGradientBrush&gt;
                      &lt;/Rectangle.Fill&gt;
                    &lt;/Rectangle&gt;
                    &lt;Rectangle Margin="1" x:Name="Highlight" IsHitTestVisible="false" Opacity="0" Stroke="#FF45D6FA" StrokeThickness="1" RadiusX="1" RadiusY="1"/&gt;
                    &lt;Border x:Name="DisabledVisualElement" IsHitTestVisible="False" Opacity="0" Background="#A5F7F7F7" BorderBrush="#A5F7F7F7" BorderThickness="{TemplateBinding BorderThickness}"/&gt;
                    &lt;Rectangle x:Name="FocusVisualElement" IsHitTestVisible="false" Visibility="Collapsed" Stroke="#FF45D6FA" StrokeThickness="1" RadiusX="1" RadiusY="1"/&gt;
                    &lt;Path Height="Auto" HorizontalAlignment="Stretch" Margin="4,3,4,3" VerticalAlignment="Stretch" Width="Auto" Fill="#FF333333" Stretch="Uniform" Data="F1 M 531.107,321.943L 541.537,321.943L 536.322,328.042L 531.107,321.943 Z "/&gt;
                  &lt;/Grid&gt;
                &lt;/ControlTemplate&gt;
              &lt;/Grid.Resources&gt;
              &lt;vsm:VisualStateManager.VisualStateGroups&gt;
                &lt;!-- common states --&gt;
                &lt;vsm:VisualStateGroup x:Name="CommonStates"&gt;
                  &lt;vsm:VisualStateGroup.Transitions&gt;
                    &lt;vsm:VisualTransition GeneratedDuration="0"/&gt;
                  &lt;/vsm:VisualStateGroup.Transitions&gt;
                  &lt;vsm:VisualState x:Name="Normal"/&gt;
                  &lt;vsm:VisualState x:Name="Disabled"&gt;
                    &lt;Storyboard&gt;
                      &lt;DoubleAnimation Duration="0" Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="(UIElement.Opacity)" To="1"/&gt;
                    &lt;/Storyboard&gt;
                  &lt;/vsm:VisualState&gt;
                &lt;/vsm:VisualStateGroup&gt;
                &lt;!-- focus states --&gt;
                &lt;vsm:VisualStateGroup x:Name="FocusStates"&gt;
                  &lt;vsm:VisualState x:Name="Focused"&gt;
                    &lt;Storyboard&gt;
                      &lt;ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="Visibility"&gt;
                        &lt;DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/&gt;
                      &lt;/ObjectAnimationUsingKeyFrames&gt;
                    &lt;/Storyboard&gt;
                  &lt;/vsm:VisualState&gt;
                  &lt;vsm:VisualState x:Name="Unfocused"/&gt;
                &lt;/vsm:VisualStateGroup&gt;
                &lt;!-- Increase states --&gt;
                &lt;vsm:VisualStateGroup x:Name="IncreaseStates"&gt;
                  &lt;vsm:VisualState x:Name="IncreaseEnabled" /&gt;
                  &lt;vsm:VisualState x:Name="IncreaseDisabled" /&gt;
                &lt;/vsm:VisualStateGroup&gt;
                &lt;!-- Decrease states--&gt;
                &lt;vsm:VisualStateGroup x:Name="DecreaseStates"&gt;
                  &lt;vsm:VisualState x:Name="DecreaseEnabled" /&gt;
                  &lt;vsm:VisualState x:Name="DecreaseDisabled" /&gt;
                &lt;/vsm:VisualStateGroup&gt;
              &lt;/vsm:VisualStateManager.VisualStateGroups&gt;
              &lt;Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}"&gt;
                &lt;Grid&gt;
                  &lt;Grid.RowDefinitions&gt;
                    &lt;RowDefinition Height="Auto"/&gt;
                    &lt;RowDefinition Height="*"/&gt;
                    &lt;RowDefinition Height="Auto"/&gt;
                  &lt;/Grid.RowDefinitions&gt;
                  &lt;ContentPresenter Grid.Row="1" 
                                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
                                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
                                    Content="{TemplateBinding Content}"/&gt;
                  &lt;Button Grid.Row="0" IsTabStop="False" IsHitTestVisible="True"&gt;
                    &lt;Button.Template&gt;
                      &lt;ControlTemplate TargetType="Button"&gt;
                        &lt;Grid Background="Transparent" /&gt;
                      &lt;/ControlTemplate&gt;
                    &lt;/Button.Template&gt;
                  &lt;/Button&gt;
                  &lt;Button Grid.Row="2" IsTabStop="False" IsHitTestVisible="True"&gt;
                    &lt;Button.Template&gt;
                      &lt;ControlTemplate TargetType="Button"&gt;
                        &lt;Grid Background="Transparent" /&gt;
                      &lt;/ControlTemplate&gt;
                    &lt;/Button.Template&gt;
                  &lt;/Button&gt;
                  &lt;RepeatButton Grid.Row="0" Height="24" IsTabStop="False" Template="{StaticResource IncreaseButtonTemplate}" x:Name="IncreaseButton" ClickMode="Press"/&gt;
                  &lt;RepeatButton Grid.Row="2" Height="24" IsTabStop="False" Template="{StaticResource DecreaseButtonTemplate}" x:Name="DecreaseButton" ClickMode="Press"/&gt;
                &lt;/Grid&gt;
              &lt;/Border&gt;
              &lt;Border x:Name="DisabledVisualElement" IsHitTestVisible="false" Opacity="0" Background="#A5FFFFFF" CornerRadius="3"/&gt;
              &lt;Border x:Name="FocusVisualElement" IsHitTestVisible="false" Visibility="Collapsed" BorderBrush="#FF45D6FA" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="1,1,1,1"/&gt;
            &lt;/Grid&gt;
          &lt;/ControlTemplate&gt;
        &lt;/Setter.Value&gt;
      &lt;/Setter&gt;
    &lt;/Style&gt;
    
    &lt;!-- ButtonSpinnerLeftyStyle --&gt;
    &lt;Style x:Key="ButtonSpinnerLeftyStyle" TargetType="inputToolkit:ButtonSpinner"&gt;
      &lt;Setter Property="HorizontalContentAlignment" Value="Center"/&gt;
      &lt;Setter Property="VerticalContentAlignment" Value="Center"/&gt;
      &lt;Setter Property="Template"&gt;
        &lt;Setter.Value&gt;
          &lt;ControlTemplate TargetType="inputToolkit:ButtonSpinner"&gt;
            &lt;Grid&gt;
              &lt;Grid.Resources&gt;
                &lt;ControlTemplate x:Key="IncreaseButtonTemplate" TargetType="RepeatButton"&gt;
                  &lt;Grid x:Name="Root"&gt;
                    &lt;vsm:VisualStateManager.VisualStateGroups&gt;
                      &lt;vsm:VisualStateGroup x:Name="CommonStates"&gt;
                        &lt;vsm:VisualStateGroup.Transitions&gt;
                          &lt;vsm:VisualTransition GeneratedDuration="0"/&gt;
                          &lt;vsm:VisualTransition GeneratedDuration="00:00:00.1" To="MouseOver"/&gt;
                          &lt;vsm:VisualTransition GeneratedDuration="00:00:00.1" To="Pressed"/&gt;
                        &lt;/vsm:VisualStateGroup.Transitions&gt;
                        &lt;vsm:VisualState x:Name="Normal"/&gt;
                        &lt;vsm:VisualState x:Name="MouseOver"&gt;
                          &lt;Storyboard&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#FF448DCA"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#F2FFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#CCFFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#7FFFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                          &lt;/Storyboard&gt;
                        &lt;/vsm:VisualState&gt;
                        &lt;vsm:VisualState x:Name="Pressed"&gt;
                          &lt;Storyboard&gt;
                            &lt;DoubleAnimationUsingKeyFrames Storyboard.TargetName="Highlight" Storyboard.TargetProperty="(UIElement.Opacity)"&gt;
                              &lt;SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/&gt;
                            &lt;/DoubleAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#FF448DCA"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#F4FFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#EAFFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#C6FFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#6BFFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                          &lt;/Storyboard&gt;
                        &lt;/vsm:VisualState&gt;
                        &lt;vsm:VisualState x:Name="Disabled"&gt;
                          &lt;Storyboard&gt;
                            &lt;DoubleAnimationUsingKeyFrames Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="Opacity"&gt;
                              &lt;SplineDoubleKeyFrame KeyTime="0" Value="1"/&gt;
                            &lt;/DoubleAnimationUsingKeyFrames&gt;
                          &lt;/Storyboard&gt;
                        &lt;/vsm:VisualState&gt;
                      &lt;/vsm:VisualStateGroup&gt;
                      &lt;vsm:VisualStateGroup x:Name="FocusStates"&gt;
                        &lt;vsm:VisualState x:Name="Focused"&gt;
                          &lt;Storyboard&gt;
                            &lt;ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="Visibility"&gt;
                              &lt;DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/&gt;
                            &lt;/ObjectAnimationUsingKeyFrames&gt;
                          &lt;/Storyboard&gt;
                        &lt;/vsm:VisualState&gt;
                        &lt;vsm:VisualState x:Name="Unfocused"/&gt;
                      &lt;/vsm:VisualStateGroup&gt;
                    &lt;/vsm:VisualStateManager.VisualStateGroups&gt;
                    &lt;Rectangle x:Name="Background" Fill="{TemplateBinding Background}" StrokeThickness="1" RadiusX="2" RadiusY="2"&gt;
                      &lt;Rectangle.Stroke&gt;
                        &lt;LinearGradientBrush EndPoint=".5,1" StartPoint=".5,0"&gt;
                          &lt;GradientStop Color="#FFAEB7BF" Offset="0"/&gt;
                          &lt;GradientStop Color="#FF919EA7" Offset="0.35"/&gt;
                          &lt;GradientStop Color="#FF7A8A99" Offset="0.35"/&gt;
                          &lt;GradientStop Color="#FF647480" Offset="1"/&gt;
                        &lt;/LinearGradientBrush&gt;
                      &lt;/Rectangle.Stroke&gt;
                    &lt;/Rectangle&gt;
                    &lt;Rectangle Margin="1" x:Name="BackgroundGradient" Stroke="#FFFFFFFF" StrokeThickness="1" RadiusX="1" RadiusY="1"&gt;
                      &lt;Rectangle.Fill&gt;
                        &lt;LinearGradientBrush EndPoint=".7,1" StartPoint=".7,0"&gt;
                          &lt;GradientStop Color="#FFFFFFFF" Offset="0"/&gt;
                          &lt;GradientStop Color="#F9FFFFFF" Offset="0.375"/&gt;
                          &lt;GradientStop Color="#E5FFFFFF" Offset="0.625"/&gt;
                          &lt;GradientStop Color="#C6FFFFFF" Offset="1"/&gt;
                        &lt;/LinearGradientBrush&gt;
                      &lt;/Rectangle.Fill&gt;
                    &lt;/Rectangle&gt;
                    &lt;Rectangle Margin="1" x:Name="Highlight" IsHitTestVisible="false" Opacity="0" Stroke="#FF45D6FA" StrokeThickness="1" RadiusX="1" RadiusY="1"/&gt;
                    &lt;Border x:Name="DisabledVisualElement" IsHitTestVisible="False" Opacity="0" Background="#A5F7F7F7" BorderBrush="#A5F7F7F7" BorderThickness="{TemplateBinding BorderThickness}"/&gt;
                    &lt;Rectangle x:Name="FocusVisualElement" IsHitTestVisible="false" Visibility="Collapsed" Stroke="#FF45D6FA" StrokeThickness="1" RadiusX="1" RadiusY="1"/&gt;
                    &lt;Path HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Fill="#FF333333" Stretch="Uniform" Data="F1 M 541.537,173.589L 531.107,173.589L 536.322,167.49L 541.537,173.589 Z " Margin="4,3,4,3"/&gt;
                  &lt;/Grid&gt;
                &lt;/ControlTemplate&gt;
                &lt;ControlTemplate x:Key="DecreaseButtonTemplate" TargetType="RepeatButton"&gt;
                  &lt;Grid x:Name="Root"&gt;
                    &lt;vsm:VisualStateManager.VisualStateGroups&gt;
                      &lt;vsm:VisualStateGroup x:Name="CommonStates"&gt;
                        &lt;vsm:VisualStateGroup.Transitions&gt;
                          &lt;vsm:VisualTransition GeneratedDuration="0"/&gt;
                          &lt;vsm:VisualTransition GeneratedDuration="00:00:00.1" To="MouseOver"/&gt;
                          &lt;vsm:VisualTransition GeneratedDuration="00:00:00.1" To="Pressed"/&gt;
                        &lt;/vsm:VisualStateGroup.Transitions&gt;
                        &lt;vsm:VisualState x:Name="Normal"/&gt;
                        &lt;vsm:VisualState x:Name="MouseOver"&gt;
                          &lt;Storyboard&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#FF448DCA"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#F2FFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#CCFFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#7FFFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                          &lt;/Storyboard&gt;
                        &lt;/vsm:VisualState&gt;
                        &lt;vsm:VisualState x:Name="Pressed"&gt;
                          &lt;Storyboard&gt;
                            &lt;DoubleAnimationUsingKeyFrames Storyboard.TargetName="Highlight" Storyboard.TargetProperty="(UIElement.Opacity)"&gt;
                              &lt;SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/&gt;
                            &lt;/DoubleAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#FF448DCA"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#F4FFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#EAFFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#C6FFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                            &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)"&gt;
                              &lt;SplineColorKeyFrame KeyTime="00:00:00" Value="#6BFFFFFF"/&gt;
                            &lt;/ColorAnimationUsingKeyFrames&gt;
                          &lt;/Storyboard&gt;
                        &lt;/vsm:VisualState&gt;
                        &lt;vsm:VisualState x:Name="Disabled"&gt;
                          &lt;Storyboard&gt;
                            &lt;DoubleAnimationUsingKeyFrames Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="Opacity"&gt;
                              &lt;SplineDoubleKeyFrame KeyTime="0" Value="1"/&gt;
                            &lt;/DoubleAnimationUsingKeyFrames&gt;
                          &lt;/Storyboard&gt;
                        &lt;/vsm:VisualState&gt;
                      &lt;/vsm:VisualStateGroup&gt;
                      &lt;vsm:VisualStateGroup x:Name="FocusStates"&gt;
                        &lt;vsm:VisualState x:Name="Focused"&gt;
                          &lt;Storyboard&gt;
                            &lt;ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="Visibility"&gt;
                              &lt;DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/&gt;
                            &lt;/ObjectAnimationUsingKeyFrames&gt;
                          &lt;/Storyboard&gt;
                        &lt;/vsm:VisualState&gt;
                        &lt;vsm:VisualState x:Name="Unfocused"/&gt;
                      &lt;/vsm:VisualStateGroup&gt;
                    &lt;/vsm:VisualStateManager.VisualStateGroups&gt;
                    &lt;Rectangle x:Name="Background" Fill="{TemplateBinding Background}" StrokeThickness="1" RadiusX="2" RadiusY="2"&gt;
                      &lt;Rectangle.Stroke&gt;
                        &lt;LinearGradientBrush EndPoint=".5,1" StartPoint=".5,0"&gt;
                          &lt;GradientStop Color="#FFAEB7BF" Offset="0"/&gt;
                          &lt;GradientStop Color="#FF919EA7" Offset="0.35"/&gt;
                          &lt;GradientStop Color="#FF7A8A99" Offset="0.35"/&gt;
                          &lt;GradientStop Color="#FF647480" Offset="1"/&gt;
                        &lt;/LinearGradientBrush&gt;
                      &lt;/Rectangle.Stroke&gt;
                    &lt;/Rectangle&gt;
                    &lt;Rectangle Margin="1" x:Name="BackgroundGradient" Stroke="#FFFFFFFF" StrokeThickness="1" RadiusX="1" RadiusY="1"&gt;
                      &lt;Rectangle.Fill&gt;
                        &lt;LinearGradientBrush EndPoint=".7,1" StartPoint=".7,0"&gt;
                          &lt;GradientStop Color="#FFFFFFFF" Offset="0"/&gt;
                          &lt;GradientStop Color="#F9FFFFFF" Offset="0.375"/&gt;
                          &lt;GradientStop Color="#E5FFFFFF" Offset="0.625"/&gt;
                          &lt;GradientStop Color="#C6FFFFFF" Offset="1"/&gt;
                        &lt;/LinearGradientBrush&gt;
                      &lt;/Rectangle.Fill&gt;
                    &lt;/Rectangle&gt;
                    &lt;Rectangle Margin="1" x:Name="Highlight" IsHitTestVisible="false" Opacity="0" Stroke="#FF45D6FA" StrokeThickness="1" RadiusX="1" RadiusY="1"/&gt;
                    &lt;Border x:Name="DisabledVisualElement" IsHitTestVisible="False" Opacity="0" Background="#A5F7F7F7" BorderBrush="#A5F7F7F7" BorderThickness="{TemplateBinding BorderThickness}"/&gt;
                    &lt;Rectangle x:Name="FocusVisualElement" IsHitTestVisible="false" Visibility="Collapsed" Stroke="#FF45D6FA" StrokeThickness="1" RadiusX="1" RadiusY="1"/&gt;
                    &lt;Path Height="Auto" HorizontalAlignment="Stretch" Margin="4,3,4,3" VerticalAlignment="Stretch" Width="Auto" Fill="#FF333333" Stretch="Uniform" Data="F1 M 531.107,321.943L 541.537,321.943L 536.322,328.042L 531.107,321.943 Z "/&gt;
                  &lt;/Grid&gt;
                &lt;/ControlTemplate&gt;
              &lt;/Grid.Resources&gt;
              &lt;vsm:VisualStateManager.VisualStateGroups&gt;
                &lt;!-- common states --&gt;
                &lt;vsm:VisualStateGroup x:Name="CommonStates"&gt;
                  &lt;vsm:VisualStateGroup.Transitions&gt;
                    &lt;vsm:VisualTransition GeneratedDuration="0"/&gt;
                  &lt;/vsm:VisualStateGroup.Transitions&gt;
                  &lt;vsm:VisualState x:Name="Normal"/&gt;
                  &lt;vsm:VisualState x:Name="Disabled"&gt;
                    &lt;Storyboard&gt;
                      &lt;DoubleAnimation Duration="0" Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="(UIElement.Opacity)" To="1"/&gt;
                    &lt;/Storyboard&gt;
                  &lt;/vsm:VisualState&gt;
                &lt;/vsm:VisualStateGroup&gt;
                &lt;!-- focus states --&gt;
                &lt;vsm:VisualStateGroup x:Name="FocusStates"&gt;
                  &lt;vsm:VisualState x:Name="Focused"&gt;
                    &lt;Storyboard&gt;
                      &lt;ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="Visibility"&gt;
                        &lt;DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/&gt;
                      &lt;/ObjectAnimationUsingKeyFrames&gt;
                    &lt;/Storyboard&gt;
                  &lt;/vsm:VisualState&gt;
                  &lt;vsm:VisualState x:Name="Unfocused"/&gt;
                &lt;/vsm:VisualStateGroup&gt;
                &lt;!-- Increase states --&gt;
                &lt;vsm:VisualStateGroup x:Name="IncreaseStates"&gt;
                  &lt;vsm:VisualState x:Name="IncreaseEnabled" /&gt;
                  &lt;vsm:VisualState x:Name="IncreaseDisabled" /&gt;
                &lt;/vsm:VisualStateGroup&gt;
                &lt;!-- Decrease states--&gt;
                &lt;vsm:VisualStateGroup x:Name="DecreaseStates"&gt;
                  &lt;vsm:VisualState x:Name="DecreaseEnabled" /&gt;
                  &lt;vsm:VisualState x:Name="DecreaseDisabled" /&gt;
                &lt;/vsm:VisualStateGroup&gt;
              &lt;/vsm:VisualStateManager.VisualStateGroups&gt;
              &lt;Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}"&gt;
                &lt;Grid&gt;
                  &lt;Grid.RowDefinitions&gt;
                    &lt;RowDefinition /&gt;
                    &lt;RowDefinition /&gt;
                  &lt;/Grid.RowDefinitions&gt;
                  &lt;Grid.ColumnDefinitions&gt;
                    &lt;ColumnDefinition Width="Auto" /&gt;
                    &lt;ColumnDefinition Width="*"/&gt;
                  &lt;/Grid.ColumnDefinitions&gt;
                  &lt;ContentPresenter Grid.Column="1" Grid.RowSpan="2"
                                    HorizontalAlignment="Stretch" 
                                    VerticalAlignment="Stretch"
                                    Content="{TemplateBinding Content}"/&gt;
                  &lt;Button Grid.Column="0" Grid.RowSpan="2" IsTabStop="False" IsHitTestVisible="True"&gt;
                    &lt;Button.Template&gt;
                      &lt;ControlTemplate TargetType="Button"&gt;
                        &lt;Grid Background="Transparent" /&gt;
                      &lt;/ControlTemplate&gt;
                    &lt;/Button.Template&gt;
                  &lt;/Button&gt;
                  &lt;RepeatButton Grid.Row="0" Height="24" Width="20" IsTabStop="False" Template="{StaticResource IncreaseButtonTemplate}" x:Name="IncreaseButton" ClickMode="Press"/&gt;
                  &lt;RepeatButton Grid.Row="1" Height="24" Width="20" IsTabStop="False" Template="{StaticResource DecreaseButtonTemplate}" x:Name="DecreaseButton" ClickMode="Press"/&gt;
                &lt;/Grid&gt;
              &lt;/Border&gt;
              &lt;Border x:Name="DisabledVisualElement" IsHitTestVisible="false" Opacity="0" Background="#A5FFFFFF" CornerRadius="3"/&gt;
              &lt;Border x:Name="FocusVisualElement" IsHitTestVisible="false" Visibility="Collapsed" BorderBrush="#FF45D6FA" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="1,1,1,1"/&gt;
            &lt;/Grid&gt;
          &lt;/ControlTemplate&gt;
        &lt;/Setter.Value&gt;
      &lt;/Setter&gt;
    &lt;/Style&gt;

  &lt;/UserControl.Resources&gt;

  &lt;StackPanel Background="White"&gt;
    &lt;ContentControl
      Content="Button spinner Horizontal"
      Style="{StaticResource Header}" /&gt;
    &lt;inputToolkit:DomainUpDown
      MinWidth="120"
      Height="80"
      HorizontalAlignment="Left"
      SpinnerStyle="{StaticResource ButtonSpinnerHorizontalStyle}"&gt;
      &lt;System:String&gt;Red&lt;/System:String&gt;
      &lt;System:String&gt;Green&lt;/System:String&gt;
      &lt;System:String&gt;Blue&lt;/System:String&gt;
      &lt;System:String&gt;Yellow&lt;/System:String&gt;
      &lt;System:String&gt;Black&lt;/System:String&gt;
    &lt;/inputToolkit:DomainUpDown&gt;

    &lt;ContentControl
      Content="Button spinner Left"
      Style="{StaticResource Header}" /&gt;
    &lt;inputToolkit:DomainUpDown
      MinWidth="120"
      Height="60"
      HorizontalAlignment="Left"
      SpinnerStyle="{StaticResource ButtonSpinnerLeftyStyle}"&gt;
      &lt;System:String&gt;Red&lt;/System:String&gt;
      &lt;System:String&gt;Green&lt;/System:String&gt;
      &lt;System:String&gt;Blue&lt;/System:String&gt;
      &lt;System:String&gt;Yellow&lt;/System:String&gt;
      &lt;System:String&gt;Black&lt;/System:String&gt;
    &lt;/inputToolkit:DomainUpDown&gt;
  &lt;/StackPanel&gt;
&lt;/UserControl&gt;
</sys:String>
    </src:SourceFile.Source>
  </src:SourceFile>
  <src:SourceFile Path="DomainUpDownSpinnerSample.xaml.vb">
    <src:SourceFile.Source>
      <sys:String>' (c) Copyright Microsoft Corporation.
' This source is subject to the Microsoft Public License (Ms-PL).
' Please see http://go.microsoft.com/fwlink/?LinkID=131993 for details.
' All other rights reserved.

Imports Microsoft.VisualBasic
Imports System
Imports System.Globalization
Imports System.Windows
Imports System.Windows.Controls
Imports System.Windows.Media
Imports System.Collections
Imports System.Reflection
Imports System.ComponentModel

''' &lt;summary&gt;
''' Sample page demonstrating DomainUpDown.
''' &lt;/summary&gt;
&lt;Sample("DomainUpDown with ButtonStyles", DifficultyLevel.Basic), Category("DomainUpDown")&gt; _
Public Class DomainUpDownSpinnerSample
    Inherits UserControl

    ''' &lt;summary&gt;
    ''' Initializes a new instance of the &lt;see cref="DomainUpDownSpinnerSample"/&gt; class.
    ''' &lt;/summary&gt;
    Public Sub New()
        InitializeComponent()
    End Sub
End Class
</sys:String>
    </src:SourceFile.Source>
  </src:SourceFile>
</src:SourceViewer>
  </StackPanel>
</UserControl>
